import React from 'react';
import classNames from 'classnames';

export interface RowFlexProps {
    prefixCls?: string,
    className?: string,
    style?: React.CSSProperties,
    justify?: "start" | "space-between";
    height?: number | string;
    ref?:any
}

export default class RowFlex extends React.Component<RowFlexProps, any> {
    static defaultProps = {
        prefixCls: 'mousex-flex',
        justify: "start"
    };

    render() {
        const {
            prefixCls,
            className,
            style,
            justify,
            height,
            children,
            ref
        } = this.props;

        const wrapCls = classNames(prefixCls, className, {
            [`${prefixCls}-row`]: true,
            [`${prefixCls}-justify-start`]: justify === "start",
            [`${prefixCls}-justify-space-between`]: justify === "space-between",
        });


        let cssStyle = {};
        if (height) {
            cssStyle = {
                ...cssStyle,
                height
            }
        }
        if (style) {
            cssStyle = {
                ...cssStyle,
                ...style
            }
        }

        return (
            <div ref={ref} className={wrapCls} style={cssStyle}>
                {children}
            </div>
        );
    }
}
